01. Introduction

State Management Intro

App Introduction

Get Project Files

Create React App will generate a number of default files and starter code that we need to get rid of. There will be two sets of changes you need to make, delete the starter content and add files that we're providing you.

But, we've already done this for you! Please clone this repo and checkout the starter-files-added branch to have it all done for you.

Task Description:

Make sure to do each of the following:

Task List:

Task Feedback:

Good work!

The Backend Server

The Contacts app project that we're building is a front-end project. However, we'll eventually be storing the contacts on a backend server. Since we're only really focusing on the front-end for this course, we've gone ahead and built this server for you so you can focus on just the React parts of this program.

The server is just a simple Node/Express app. The repo for the project is at https://github.com/udacity/reactnd-contacts-server2. All you need to do is:

  • clone the project with git clone https://github.com/udacity/reactnd-contacts-server2.git
  • install the project dependencies with npm install
  • start the server with node server.js

Once you've started the server, you can forget about it. The Contacts project we're working on will interact with this server, but we won't ever modify any of the server code.

💡 Running Two Servers💡

At this point, you should be running two different servers on your local machine:

  • Front-end development server: Accessible on port 3000 (with npm start or yarn start)
  • Back-end server: Accessible on port 5001 (with node server.js)

Please be sure that both are running before moving on in this Lesson.

Task Description:

To make sure we're working with the same code, check off each one of these:

Task List:

Task Feedback:

It's always a good idea to sanity check your code!